<template>
	<view class="Global">
		<!-- 背景图片铺满 -->
		<!-- 	<image class="imagepage" mode=""></image>
		<view class="personnel" :style="{'height':tarbarHeight+'px'}">
			<text class="title">{{personnelInfo}}</text>
		</view> -->


		<bgImage></bgImage>
		<MyNav :title="title" bgColor="" :backIcon="isback" id="main"></MyNav>
		<scroll-view scroll-y="true" class="Content" :style="'height:'+scrollViewHeight+'px'">
			<view class="ContentInner">
				<!-- 基础信息 -->
				<view class="baseInfo" v-if="baseInfoTitleShow">
					<view class="baseInfoText">
						<text class="baseImg"></text>
						<text class="baseText">{{baseInfoTitle}}</text>
					</view>
					<view class="baseList">
						<view class="baseListItem" v-for="(item,index) in baseList" @click="baseListOnClick(item)">
							<view class="baseListItemOut" :style="{background: item.color}">

							</view>
							<image class="baseListItemImg" :src="item.icon" mode=""></image>

							<text class="baseListItemText">{{item.title}}</text>
						</view>
					</view>
				</view>


				<!-- 裁床打菲 -->
				<view class="basecutTheBed" v-if="cutTheBedShow">
					<view class="baseInfoText">
						<text class="baseImg"></text>
						<text class="baseText">{{cutTheBed}}</text>
					</view>
					<view class="baseList">
						<view class="baseListItem" v-for="(item,index) in cutTheBedList">
							<view class="baseListItemOut" :style="{background: item.color}"
								@click="baseListOnClick(item)">

							</view>
							<image class="baseListItemImg" :src="item.icon" mode=""></image>
							<text class="baseListItemText">{{item.title}}</text>
						</view>
					</view>
				</view>


				<!-- 打菲管理 -->
				<view class="DafeiManagement" v-if="DafeiManagementShow">
					<view class="baseInfoText">
						<text class="baseImg"></text>
						<text class="baseText">{{DafeiManagement}}</text>
					</view>
					<view class="baseList">
						<view class="baseListItem" v-for="(item,index) in dafeiManagementList"
							@click="baseListOnClick(item)">
							<view class="baseListItemOut" :style="{background: item.color}">

							</view>
							<image class="baseListItemImg" :src="item.icon" mode=""></image>
							<text class="baseListItemText">{{item.title}}</text>
						</view>
					</view>
				</view>

				<!-- 打印机设置 -->
				<view class="printerSetup" v-if="printerSetupShow">
					<view class="baseInfoText">
						<text class="baseImg"></text>
						<text class="baseText">{{printerSetup}}</text>
					</view>
					<view class="baseList">
						<view class="baseListItem" v-for="(item,index) in printerSetupList"
							@click="baseListOnClick(item)">
							<view class="baseListItemOut" :style="{background: item.color}">

							</view>
							<image class="baseListItemImg" :src="item.icon" mode=""></image>
							<text class="baseListItemText">{{item.title}}</text>
						</view>
					</view>
				</view>


				<!-- 数据报表 -->
				<view class="printerSetup" v-if="dataReportShow">
					<view class="baseInfoText">
						<text class="baseImg"></text>
						<text class="baseText">{{dataReport}}</text>
					</view>
					<view class="baseList">
						<view class="baseListItem" v-for="(item,index) in dataReportList"
							@click="baseListOnClick(item)">
							<view class="baseListItemOut" :style="{background: item.color}">

							</view>
							<image class="baseListItemImg" :src="item.icon" mode=""></image>
							<text class="baseListItemText">{{item.title}}</text>
						</view>
					</view>
				</view>

				<!-- 考勤打卡 -->
				<view class="clockIn" v-if="clockInShow">
					<view class="baseInfoText">
						<text class="baseImg"></text>
						<text class="baseText">{{clockIn}}</text>
					</view>
					<view class="baseList">
						<view class="baseListItem" v-for="(item,index) in clockInList" @click="baseListOnClick(item)">
							<view class="baseListItemOut" :style="{background: item.color}">

							</view>
							<image class="baseListItemImg" :src="item.icon" mode=""></image>
							<text class="baseListItemText">{{item.title}}</text>
						</view>
					</view>
				</view>


			</view>
		</scroll-view>
	</view>
</template>

<script>
	import MyNav from '@/components/customnavbar.vue'
	import bgImage from '@/components/backgroundImage.vue'
	import {

		getRouters

	} from '@/pages/api/api.js'
	export default {
		components: {
			MyNav,
			bgImage
		},
		data() {
			return {
				// 图表选择 年月日 默认选中日
				isSelect: 1,


				login: '确定发送',

				title: '工作台',

				isback: false,

				personnelInfo: '工作台',
				tops: 0,
				height: 0,
				tarbarHeight: 0,
				baseInfoTitle: '基础信息',
				cutTheBed: '裁床打菲',
				DafeiManagement: '打菲管理',
				printerSetup: '打印机设置',
				dataReport: '数据报表',
				clockIn: '考勤打卡',

				baseInfoTitleShow: true,
				cutTheBedShow: true,
				DafeiManagementShow: true,
				printerSetupShow: true,
				dataReportShow: true,
				clockInShow: true,





				baseList: [{
						title: '工序模版',
						icon: '../../static/gongzuotai/gongxu_muban.png',
						color: '#0081FF'
					},
					{
						title: '工序管理',
						icon: '../../static/gongzuotai/gongxu_guanli.png',
						color: '#FA730A'
					},
					{
						title: '尺码管理',
						icon: '../../static/gongzuotai/chima_guanli.png',
						color: '#6BAFB1'
					},
					// {
					// 	title: '颜色分组',
					// 	icon: '../../static/gongzuotai/yanse_guanli.png',
					// 	color: '#7CC563'
					// },
					{
						title: '颜色管理',
						icon: '../../static/gongzuotai/yanse_guanli.png',
						color: '#7CC563'
					},
					{
						title: '尺码组',
						icon: '../../static/gongzuotai/chimazu.png',
						color: '#FA730A'
					},
					{
						title: '部门管理',
						icon: '../../static/gongzuotai/bumen_guanli.png',
						color: '#0081FF'
					},
					{
						title: '员工管理',
						icon: '../../static/gongzuotai/yuangong_guanli.png',
						color: '#7CC563'
					},
          {
            title: '角色管理',
            icon: '../../static/gongzuotai/yuangong_guanli.png',
            color: '#7CC563'
          }

				],
				cutTheBedList: [{
						title: '款式管理',
						icon: '../../static/gongzuotai/kuanshi_guanli.png',
						color: '#0081FF'
					},
					{
						title: '裁床订单',
						icon: '../../static/gongzuotai/caichuang_dingdan.png',
						color: '#0081FF'
					},
					{
						title: '打印菲票',
						icon: '../../static/gongzuotai/dayin_feipiao.png',
						color: '#0081FF'
					}


				],
				dafeiManagementList: [
          {
            title: '坏片管理',
            icon: '../../static/gongzuotai/saoma_baogong.png',
            color: '#0081FF'
          },
          {
						title: '扫码报工',
						icon: '../../static/gongzuotai/saoma_baogong.png',
						color: '#0081FF'
					},
					{
						title: '手工报工',
						icon: '../../static/gongzuotai/shougong_baogong.png',
						color: '#6BAFB1'
					},
					{
						title: '删除菲',
						icon: '../../static/gongzuotai/shanchufei.png',
						color: '#FA730A'
					},

				],
				printerSetupList: [{
						title: '添加打印机',
						icon: '../../static/gongzuotai/tianjia_dayinji.png',
						color: '#0081FF'
					},
					{
						title: '打印机列表',
						icon: '../../static/gongzuotai/dayinji_liebiao.png',
						color: '#7CC563'
					},
					{
						title: '发送到打印机',
						icon: '../../static/gongzuotai/fasong_dayinji.png',
						color: '#FA730A'
					}


				],
				dataReportList: [{
						title: '订单生产情况',
						icon: '../../static/gongzuotai/dingdan_shengchan.png',
						color: '#0081FF'
					},
          {
            title: '生产情况查询',
            icon: '../../static/gongzuotai/dingdan_shengchan.png',
            color: '#0081FF'
          },
          {
            title: '生产明细查询',
            icon: '../../static/gongzuotai/dingdan_shengchan.png',
            color: '#0081FF'
          },
          {
            title: '成品产量查询',
            icon: '../../static/gongzuotai/dingdan_shengchan.png',
            color: '#0081FF'
          },
          {
            title: '产量表',
            icon: '../../static/gongzuotai/dingdan_shengchan.png',
            color: '#0081FF'
          },
          {
            title: '款号生产汇总表',
            icon: '../../static/gongzuotai/dingdan_shengchan.png',
            color: '#0081FF'
          },
          {
            title: '员工产量表',
            icon: '../../static/gongzuotai/dingdan_shengchan.png',
            color: '#0081FF'
          },
					{
						title: '员工薪资',
						icon: '../../static/gongzuotai/yuangong_xinzi.png',
						color: '#FA730A'
					}
				],
				clockInList: [{
						title: '打卡',
						icon: '../../static/gongzuotai/daka.png',
						color: '#0081FF'
					},
					{
						title: '补卡',
						icon: '../../static/gongzuotai/buka.png',
						color: '#6BAFB1'
					},
					{
						title: '请假申请',
						icon: '../../static/gongzuotai/qingjia_shenqing.png',
						color: '#FA730A'
					}

				],
				// 屏幕滚动高度
				scrollViewHeight: 0,
				mainTop: 0,

				// 显示的菜单列表
				Routers: []

			}
		},
		onLoad() {
			// 在其他页面或组件中访问
			/* const app = getApp();
			this.scrollViewHeight=app.globalData.scrollViewHeight */

			this.getRouters()
		},
		methods: {

			// 菜单权限
			getRouters() {
				getRouters().then((res) => {
					console.log('菜单权限', res);
					if (res.code == 200) {
						if (res.data == undefined || res.data.length == 0) {
							this.baseList = []
							this.cutTheBedList = []
							this.dafeiManagementList = []
							this.printerSetupList = []
							this.dataReportList = []
							this.clockInList = []
							this.baseInfoTitleShow = false
							this.cutTheBedShow = false
							this.DafeiManagementShow = false
							this.printerSetupShow = false
							this.dataReportShow = false
							this.clockInShow = false
						}
						this.Routers = [...this.Routers, ...res.data]

						console.log('Routers', this.Routers)
						this.Routers.forEach((item, index) => {
							// 表示是APP平台
							if (item.name == 'App') {


								item.children.forEach((child, childIndex) => {
									// 表示是工作台的菜单

									if (child.name == '/pages/workbench/workbench') {
										// console.log('打印数据', child);
										// 临时数据
										var temp = []
										var tempcutTheBedList = []
										var tempdafeiManagementList = []
										var tempprinterSetupList = []
										var tempdataReportList = []
										var tempclockInList = []
										child.children.forEach(secondChild => {
											// 基础信息
											if (secondChild.meta.title == '基础信息') {
												// console.log('基础信息', secondChild);
												secondChild.children.forEach((threeChild) => {
													this.baseList.forEach(item => {
														if (item.title == threeChild.meta.title) {
															temp.push(item)
														}
													})
												})
											}
											this.baseList = []
											this.baseList = temp
											if (this.baseList.length == 0) {
												this.baseInfoTitleShow = false
											}
										})

										// 裁床打菲
										child.children.forEach(secondChild => {
											if (secondChild.meta.title == '裁床打菲') {
												secondChild.children.forEach(threeChild => {
                            console.log('裁床打菲',threeChild.meta.title)
														this.cutTheBedList.forEach(item => {
																if (item.title ==threeChild.meta.title) {
																	tempcutTheBedList.push(item)
																}
                              })
													})
											}
										})
										this.cutTheBedList = []
										this.cutTheBedList = tempcutTheBedList
										if (this.cutTheBedList.length == 0) {
											this.cutTheBedShow = false
										}

										// 打菲管理
										child.children.forEach(secondChild => {
											if (secondChild.meta.title == '打菲管理') {
												secondChild.children.forEach(threeChild => {
														this.dafeiManagementList.forEach(item => {
																	if (item.title ==threeChild.meta.title) {
																		tempdafeiManagementList.push(item)
																	}
																})
													})
											}
										})
										this.dafeiManagementList = []
										this.dafeiManagementList = tempdafeiManagementList
										console.log('打菲管理', this.dafeiManagementList.length,
											tempdafeiManagementList);
										if (this.dafeiManagementList.length == 0) {
											this.DafeiManagementShow = false
										}

										// 打印机设置

										child.children.forEach(secondChild => {
											if (secondChild.meta.title == '打印机设置') {
												secondChild.children.forEach(threeChild => {
														this.printerSetupList.forEach(item => {
																if (item.title ==threeChild.meta.title) {
																	tempprinterSetupList.push(item)
																}
															})
													})
											}
										})
										this.printerSetupList = []
										this.printerSetupList = tempprinterSetupList

										if (this.printerSetupList.length == 0) {
											this.printerSetupShow = false
										}

										// 数据报表

										child.children.forEach(secondChild => {
											if (secondChild.meta.title == '数据报表') {
												secondChild.children.forEach(threeChild => {
														this.dataReportList.forEach(item => {
																if (item.title ==threeChild.meta.title) {
                                  console.log('数据报表',item.title)
																	tempdataReportList.push(item);
																}
															})
													})
											}
										})
										this.dataReportList = []
										this.dataReportList = tempdataReportList
										if (this.dataReportList.length == 0) {
											this.dataReportShow = false
										}

										// 考勤打卡

										child.children.forEach(secondChild => {
											if (secondChild.meta.title == '考勤打卡') {
												secondChild.children.forEach(threeChild => {
														this.clockInList.forEach(item => {
																if (item.title ==threeChild.meta.title) {
																	tempclockInList.push(item)
																}
															})
													})
											}
										})
										this.clockInList = []
										this.clockInList = tempclockInList
										if (this.clockInList.length == 0) {
											this.clockInShow = false
										}
										console.log('匹配数据了', tempclockInList, this
											.clockInList);


									}

								})



							}

						})


					} else {
						// 提示错误信息
						uni.showToast({
							title: res.msg,
							icon: 'none'
						});
					}


				}).catch((err) => {
					// console.error('11获取数据失败', err);
					uni.showToast({
						title: err.msg
					});
				});


			},

			// 基础信息 点击事件
			baseListOnClick(e) {
				console.log("基础信息点击事件", e.title);


				switch (e.title) {
					case '工序模版':
						uni.navigateTo({
							url: '/subPack/process/processTemplate/processTemplate',
							success: res => {},
							fail: () => {},
							complete: () => {}
						});
						break;

					case '工序管理':
						uni.navigateTo({
							url: '/subPack/processmanagement/ProcessManagement/ProcessManagement',
							success: res => {},
							fail: () => {},
							complete: () => {}
						});

						break;

					case '尺码管理':
						uni.navigateTo({
							url: '/subPack/sizeManagement/sizeManagement/sizeManagement',
							success: res => {},
							fail: () => {},
							complete: () => {}
						});
						break;

					// case '颜色分组':
					// 	uni.navigateTo({
					// 		url: '/pages/colorGroup/colorGroup/colorGroup',
					// 		success: res => {},
					// 		fail: () => {},
					// 		complete: () => {}
					// 	});
					// 	break;

					case '颜色管理':
						uni.navigateTo({
							url: '/subPackA/colorManagement/colorManagement/colorManagement',
							success: res => {},
							fail: () => {},
							complete: () => {}
						});
						break;

					case '尺码组':
						uni.navigateTo({
							url: '/subPack/sizeGroup/sizeGroup/sizeGroup',
							success: res => {},
							fail: () => {},
							complete: () => {}
						});
						break;

					case '部门管理':
						uni.navigateTo({
							url: '/subPack/departmentManagement/departmentManagement/departmentManagement',
							success: res => {},
							fail: () => {},
							complete: () => {}
						});
						break;

					case '员工管理':
						uni.navigateTo({
							url: '/subPack/employeeManagement/employeeManagement/employeeManagement',
							success: res => {},
							fail: () => {},
							complete: () => {}
						});
						break;

          case '角色管理':
            uni.navigateTo({
              url: '/subPack/roleManagement/roleManagement/roleManagement',
              success: res => {},
              fail: () => {},
              complete: () => {}
            });
            break;

					case '款式管理':
						uni.navigateTo({
							url: '/subPack/styleManagement/styleManagement/styleManagement',
							success: res => {},
							fail: () => {},
							complete: () => {}
						});
						/*uni.navigateTo({
							url: '/subPack/styleManagementNewSelect/styleManagementNewSelect',
							success: res => {},
							fail: () => {},
							complete: () => {}
						});*/
						break;

					case '裁床订单':
						uni.navigateTo({
							url: '/subPackA/cuttingOrder/cuttingOrder/cuttingOrder',
							success: res => {},
							fail: () => {},
							complete: () => {}
						});
						break;

					case '打印菲票':
						uni.navigateTo({
							url: '/subPack/printedTicket/printedTicket/printedTicket',
							success: res => {},
							fail: () => {},
							complete: () => {}
						});
						break

          case '坏片管理':
            uni.navigateTo({
              url: '/subPackA/cuttingOrder/cuttingOrderEdit/cuttingOrderEditLos',
              success: res => {},
              fail: () => {},
              complete: () => {}
            });
            break
					case '扫码报工':
						uni.navigateTo({
							// url: '/subPack/workInThePhilippines/workInThePhilippines/workInThePhilippines',
              url: '/subPack/workInThePhilippines/scanTheCode/scanTheCode',
							success: res => {},
							fail: () => {},
							complete: () => {}
						});
						break


					case '手工报工':
						uni.navigateTo({
							url: '/subPack/workInThePhilippines/reportTheWorkToThePhilippines/reportTheWorkToThePhilippines',
							success: res => {},
							fail: () => {},
							complete: () => {}
						});

					case '删除菲':
						uni.navigateTo({
							url: '/subPack/workInThePhilippines/scanTheCode/scanCodeList',
							success: res => {},
							fail: () => {},
							complete: () => {}
						});

					case '添加打印机':
						uni.navigateTo({
							url: '/subPack/printerSetup/addPrinter/addPrinter',
							success: res => {},
							fail: () => {},
							complete: () => {}
						});
						break
					case '打印机列表':
						uni.navigateTo({
							url: '/subPack/printerSetup/printerList/printerList',
							success: res => {},
							fail: () => {},
							complete: () => {}
						});
						break

					case '发送到打印机':
						uni.navigateTo({
							url: '/subPack/sendToPrinter/sendToPrinter/sendToPrinter',
							success: res => {},
							fail: () => {},
							complete: () => {}
						});
						break

					case '订单生产情况':
						uni.navigateTo({
							url: '/pages/orderList/orderList/orderList',
							success: res => {},
							fail: () => {},
							complete: () => {}
						});
						break
          case '生产情况查询':
            uni.navigateTo({
              url: '/subPack/report/queryProduction',
              success: res => {},
              fail: () => {},
              complete: () => {}
            });
            break
          case '生产明细查询':
            uni.navigateTo({
              url: '/subPack/report/queryProductionMx',
              success: res => {},
              fail: () => {},
              complete: () => {}
            });
            break
          case '成品产量查询':
            uni.navigateTo({
              url: '/subPack/report/queryProductOutput',
              success: res => {},
              fail: () => {},
              complete: () => {}
            });
            break
          case '产量表':
            uni.navigateTo({
              url: '/subPack/report/queryProductionDate',
              success: res => {},
              fail: () => {},
              complete: () => {}
            });
            break
          case '款号生产汇总表':
            uni.navigateTo({
              url: '/subPack/report/queryProductionByStyle',
              success: res => {},
              fail: () => {},
              complete: () => {}
            });
            break
          case '员工产量表':
            uni.navigateTo({
              url: '/subPack/report/queryUserProductionDate',
              success: res => {},
              fail: () => {},
              complete: () => {}
            });
            break
					case '员工薪资':
						uni.navigateTo({
							url: '/pages/employeeSalary/employeeSalary/employeeSalary',
							success: res => {},
							fail: () => {},
							complete: () => {}
						});
						break

					case '打卡':
						uni.navigateTo({
							url: '/subPack/clockIn/clockInNew/clockInNew',
							success: res => {},
							fail: () => {},
							complete: () => {}
						});
						break

					case '补卡':
						uni.navigateTo({
							url: '/subPack/replacementCard/replacementCardDetail/replacementCardDetail',
							success: res => {},
							fail: () => {},
							complete: () => {}
						});
						break

					case '请假申请':
						uni.navigateTo({
							url: '/subPack/askForLeave/askForLeave/askForLeave',
							success: res => {},
							fail: () => {},
							complete: () => {}
						});
						break


					default:
						break;

				}


			}


		},


		onReady() {
			// 获取距离顶部的距离
			let query = uni.createSelectorQuery().in(this);
			query.select('#main').boundingClientRect(data => {
				// console.log(data);
				this.mainTop = data.top

				// 在其他页面或组件中访问
				const app = getApp();
				this.scrollViewHeight = app.globalData.system.screenHeight - this.mainTop - app.globalData
					.totalHeight - 50


				/* console.log('获取距离',this.mainTop,this.scrollViewHeight);
				console.log('滚动距离',this.scrollViewHeight); */
			}).exec();

		},
	}
</script>

<style>
	.ContentInner {
		display: flex;
		justify-content: center;
		align-items: center;
		flex-direction: column;
	}

	.Content {
		display: flex;
		justify-content: center;
		align-items: center;
		height: 1000rpx;

	}

	.baseListItemText {

		font-size: 24rpx;
		color: #333333;
		line-height: 100rpx;
		text-align: center;
		font-style: normal;
		text-transform: none;
		font-weight: 600;

	}

	.baseListItemOut {

		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;

		width: 80rpx;
		height: 80rpx;

		border-radius: 20rpx;

		opacity: 0.08;



	}

	.baseListItemImg {
		width: 44rpx;
		height: 44rpx;
		margin-top: -62rpx;

	}

	.baseListItem {
		display: flex;
		flex-direction: column;
		align-items: center;


		flex: 0 0 calc((100%)/4);

	}

	.baseList {
		display: flex;
		flex-direction: row;
		width: 100%;
		flex-wrap: wrap;
		margin-top: 29rpx;
	}



	.imagepage {

		background-size: cover;
		background-repeat: no-repeat;
		background-position: center center;
		position: absolute;
		z-index: -1;
		left: 0;
		right: 0;
		bottom: 0;
		right: 0;
		width: 100%;
		height: 100%;

	}

	.baseText {
		font-family: HarmonyOS_Sans_SC_Bold;
		font-size: 28rpx;
		color: #333333;
		margin-left: 20rpx;
		text-align: left;
		font-style: normal;
		text-transform: none;
		font-weight: 600;
		height: 26rpx;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.baseImg {
		width: 4rpx;
		height: 26rpx;
		background: #0081FF;
		border-radius: 2rpx 2rpx 2rpx 2rpx;
		margin-left: 30rpx;

	}

	.baseInfoText {
		display: flex;
		flex-direction: row;
		align-items: left;
		margin-top: 30rpx;
		width: 100%;

	}

	.clockIn {
		display: flex;

		flex-direction: column;
		width: 690rpx;
		height: 244rpx;
		margin-bottom: 30rpx;
		margin-top: 30rpx;
		background: #FFFFFF;
		border-radius: 30rpx 30rpx 30rpx 30rpx;
	}

	.printerSetup {
		display: flex;

		flex-direction: column;
		width: 690rpx;
		/*height: 244rpx;*/
		margin-top: 30rpx;
		background: #FFFFFF;
		border-radius: 30rpx 30rpx 30rpx 30rpx;
    bottom: 30rpx;
	}

	.DafeiManagement {
		display: flex;

		flex-direction: column;
		width: 690rpx;
		height: 244rpx;
		margin-top: 30rpx;
		background: #FFFFFF;
		border-radius: 30rpx 30rpx 30rpx 30rpx;
	}

	.basecutTheBed {
		display: flex;

		flex-direction: column;
		width: 690rpx;
		height: 244rpx;
		margin-top: 30rpx;
		background: #FFFFFF;
		border-radius: 30rpx 30rpx 30rpx 30rpx;
	}

	.baseInfo {
		display: flex;

		flex-direction: column;
		width: 690rpx;
		height: 392rpx;
		background: #FFFFFF;
		border-radius: 30rpx 30rpx 30rpx 30rpx;
	}

	.personnel {
		display: flex;
		justify-content: center;
		align-items: center;


	}

	.title {
		font-family: HarmonyOS Sans SC;
		font-weight: bold;
		font-size: 32rpx;
		color: #333333;
		line-height: 36rpx;
	}


	.Global {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		width: 750rpx;
	}
</style>
